<template>
  <div>
    <!-- 列表区 -->
    <van-card
      v-for="(item, index) in list"
      :key="index"
      :thumb="`http://liufusong.top:8080${item.houseImg}`"
      @click="toHouse(item.houseCode)"
    >
      <!-- 标题 -->
      <template #title>
        <h3 style="font-size: 15px; color: #394043; font-weight: bold">
          {{ item.title }}
        </h3>
      </template>
      <!-- 描述信息 -->
      <template #desc>
        <p style="color: #c5c7c8">{{ item.desc }}</p>
      </template>
      <!-- 价格 -->
      <template #price>
        <div style="color: #fa614d">
          <span style="font-size: 16px; font-weight: bold">
            {{ item.price }}
            <span style="font-size: 12px">元/月</span>
          </span>
        </div>
      </template>

      <!-- 标签 #75d2dc-->
      <template #tags>
        <div style="margin-top: 5px">
          <span style="color: #75d2dc; background: #e1f5f8; padding: 0 5px">{{
            item.tags
          }}</span>
        </div>
      </template>
    </van-card>
  </div>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
      default: () => [],
    },
  },
  methods: {
    toHouse(houseCode) {
      this.$router.push({
        name: "detail",
        params: {
          houseCode,
        },
      });
    },
  },
};
</script>

<style></style>
